

import 'package:flutter_mvc_example/common/res.dart';
import 'package:flutter_mvc_example/common/widget/statebar.dart';

import 'controller.dart';
import 'package:flutter/material.dart';
import 'package:flutter_mvc/flutter_mvc.dart';

import 'market1/controller.dart';

///description:逛市场
class MarketPage extends BasePage<MarketController> {
  final market1Controller = Market1Controller();

  @override
  Widget build(BuildContext context) {
    return SystemStateBar(
      fontTheme:StateBarFontTheme.white,
      child: Material(
        child: Container(
          color: resBackgroundColorF2,

          height: MediaQuery.of(context).size.height,
          child: Stack(
            children: [
              Container(height: 180.dp,color: Color(0xffEB483F),width: MediaQuery.of(context).size.width,),
              Positioned.fill(
                child: Column(
                  children: [_buildTitle(),Expanded(child: market1Controller.widget)],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  final screens = ["档口列表", "楼层列表"];

  Widget _buildTitle() {
    final item = Container(
      decoration: BoxDecoration(
          color: Color(0xffCC0B00), borderRadius: BorderRadius.circular(4.dp)),
      width: 180.dp,
      height: 30.dp,
      child: Stack(
        children: [
          AnimatedContainer(
            width: 88.dp,
            height: 28.dp,
            duration: Duration(milliseconds: 1200),
            curve: Curves.fastLinearToSlowEaseIn,
            margin: EdgeInsets.only(left: (c.index * 90.dp + 2.dp), top: 1.dp),
            decoration: BoxDecoration(
                color: Colors.white, borderRadius: BorderRadius.circular(7.dp)),
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: screens.map((e) {
              int thisIndex = screens.indexOf(e);
              final isSelect = c.index == thisIndex;
              final color = isSelect ? Color(0xff302F2F) : Colors.white;
              final fontSize = isSelect ? 14.sp : 12.sp;
              final fontWidget = isSelect ? FontWeight.w600 : FontWeight.w400;
              return GestureDetector(
                onTap: () {
                  c.onTabClick(thisIndex);
                },
                child: Container(
                  width: 88.dp,
                  height: 26.dp,
                  margin: EdgeInsets.only(top: 2.dp),
                  color: Color(0x01ffffff),
                  child: Center(
                    child: Text(
                      e,
                      style: resTextStyle.copyWith(
                          color: color,
                          fontSize: fontSize,
                          fontWeight: fontWidget),
                    ),
                  ),
                ),
              );
            }).toList(),
          ),
        ],
      ),
    );

    return SafeArea(
      bottom: false,
      child: Container(
        height: 40.dp,
        child: Row(
          children: [
            SizedBox(
              width: 11.dp,
            ),
            Image.asset(
              "images/tongyong_fanhui.png",
              width: 19.dp,
              height: 19.dp,
            ),
            Expanded(child: Center(child: item)),
            ImageIcon(
              AssetImage("images/shouye_sousuo.png"),
              size: 18.dp,
              color: Colors.white,
            ),
            SizedBox(
              width: 15.dp,
            ),
          ],
        ),
      ),
    );
  }
}
